<template>
  <el-form :model="optForm" label-width="200px" :rules="optFormRules" ref="optForm" id="optForm">
    <el-form-item label="意见：" prop="Yijian">
      <el-input v-model="optForm.Yijian" auto-complete="off" type="textarea" :rows="4" style="width:800px" ></el-input>
    </el-form-item>
    <el-form-item label="操作选择：" prop="Operation" v-if="Operation">
      <el-radio-group v-model="optForm.Operation" style="width: 100%;margin-top:6px">
        <el-radio v-for="(item,index) in Operation" :label="index" :key="index">{{item}}</el-radio>
      </el-radio-group>
    </el-form-item>
          <hr style="height:1px;border:0;margin:0;background:#EBEEF5;overflow:hidden">
    <el-form-item label="提交用户选择：" prop="SelectUser" v-if="optForm.Operation===0">
      <el-radio-group v-model="optForm.SelectUser" style="width: 100%;margin-top:6px">
        <div v-for="(item,index) in Houxuanren" :key="index" style="font-size:16px; line-height:200%;clear:both">
          <div style="width:140px;float:left; text-align:right">{{item.Bumen}}：</div>
          <div style="margin-left:150px"><el-radio v-for="(itemUser,indexUser) in item.UserName" :label="itemUser" :key="indexUser">{{item.TrueName[indexUser]}}</el-radio></div>
        </div>
      </el-radio-group>
    </el-form-item>
          <hr style="height:1px;border:0;margin:0;background:#EBEEF5;overflow:hidden">
    <el-button type="primary" @click.native="optFormSubmit" :loading="optFormLoading" style="margin:10px 0 0 200px">提交</el-button><h1>用户意见 <el-button :icon="showinfobtnicon" circle type="success" size="mini" slot="reference" @click="showinfo"></el-button></h1>
        <div v-show="infoVisible" v-for="(item, index) in WorkFlow" :key="index" style="font-size:16px;line-height:160%;padding-left:20px;">
          <p><span>{{item.FinishTime}} <span v-if="item.Bumen">[ {{item.Bumen}} ]</span> <span style="color:blue">{{item.UserName}}</span>：{{item.Yijian}}</span></p>
          <hr style="height:1px;border:0;margin:0;background:#EBEEF5;overflow:hidden">
        </div>
  </el-form>
</template>
<script>
export default {
  components: {
  },
  props: {
    myhouxuanren: {
      type: Array
    },
    timestamp: ''
  },
  data () {
    return {
      optFormRules: {
      },
      optForm: {Operation: 0},
      optFormLoading: false,
      listLoading: false,
      Houxuanren: [],
      Operation: [],
      WorkFlow: [],
      infoVisible: true,
      showinfobtnicon: 'el-icon-caret-top'
    }
  },
  watch: {
    timestamp (val) {
      this.getinfo()
    }
  },
  methods: {
    showinfo () {
      if (this.infoVisible === true) {
        this.infoVisible = false
        this.showinfobtnicon = 'el-icon-caret-top'
      } else {
        this.infoVisible = true
        this.showinfobtnicon = 'el-icon-caret-bottom'
      }
    },
    getinfo () {
      var _this = this
      let para = {
        id: this.$route.params.id
      }
      // var personParams = { Page: 0, Pagenum: 20, Personname: '', Unitkey: '', Sortkey: '', Isace: true, timestamp: new Date().getTime() }
      this.$http
        .post(`/shenghuohui/unitrenwu`, para)
        .then(function (response) {
          if (response.data.IsSuccess === true) {
            console.log('获取成功')
            _this.Houxuanren = response.data.Houxuanren
            _this.Operation = response.data.Operation
            _this.WorkFlow = response.data.WorkFlow
            console.log(_this.Houxuanren)
          } else {
            _this.$message({
              message: '获取失败:' + response.data.Msg,
              type: 'error'
            })
          }
        })
        .catch(function (error) {
          console.log(error)
          _this.$message({
            message: '获取失败:' + error,
            type: 'error'
          })
        })
    },
    optFormSubmit: function () {
      var _this = this
      this.$refs.optForm.validate((valid) => {
        if (valid) {
          _this.optFormLoading = true
          let para = {
            id: this.$route.params.id,
            yijian: this.optForm.Yijian,
            houxuanren: this.optForm.SelectUser,
            choice: this.optForm.Operation
          }
          this.$http.post(`/shenghuohui/unittijiao`, para).then(function (response) {
            console.log(response.data.IsSuccess)
            if (response.data.IsSuccess === true) {
              _this.$message({
                message: '提交成功',
                type: 'success'
              })
              _this.$refs['optForm'].resetFields()
              _this.optFormLoading = false
              _this.$emit('refreshevent')
            } else {
              console.log('提交失败:' + response.data.Msg)
              _this.$message({
                message: '提交失败:' + response.data.Msg,
                type: 'error'
              })
              _this.optFormLoading = false
            }
          }).catch(function (error) {
            console.log(error)
            _this.$message({
              message: '提交失败:' + error,
              type: 'error'
            })
            _this.optFormLoading = false
          })
        }
      })
    }
  },
  mounted () {
    this.getinfo()
  }
}
</script>
<style>
#optForm .el-radio__label{
  color: #000 !important
}
</style>
